<template>
  <div class="home">
    {{count}}
    <img
      v-for='item in swiperdata'
      :src="item.image"
      alt=""
    >
  </div>
</template>

<script lang="ts">
import { defineComponent, computed, reactive } from "vue";
import HelloWorld from "@/components/HelloWorld.vue"; // @ is an alias to /src
import { useStore } from "vuex";
import { IState, ISwiper, IHomeApi } from "../types/index";
export default defineComponent({
  name: "Home",
  components: {
    HelloWorld,
  },
  setup(props) {
    // function createArray<T>():
    // createArray<number>(4,88)
    let state = reactive<IHomeApi>({
      name: "",
      age: 23,
      sex: 1,
      date: "",
    });
    let store = useStore<IState>();
    let count = computed(() => {
      return store.state.count;
    });

    let swiperdata = computed(() => {
      return store.state.swiperList;
    });
    store.dispatch("initSwiper");
    // state.name
    return {
      count,
      swiperdata,
    };
  },
});
</script>
